﻿
@{
    ViewData["Title"] = "文章信息";
    Layout = "~/Views/Shared/_Index.cshtml";
}
<link href="~/ui/plugins/verUpload/asset/upload.css" rel="stylesheet" />
    <div class="container-div white-bg">
        <div class="row">
            <div class="col-sm-12">
            <div class="tabs-container">
                <form class="form form-horizontal" id="contentForm">
                    <input type="hidden" name="id" id="id" value="@(ViewBag.Id)">
                    <input type="hidden" name="channel_id" id="channel_id" />
                    <div class="nav-tabs-custom">
                        <ul class="nav nav-tabs">
                            <li class="active">
                                <a data-toggle="tab" href="#tab-content" aria-expanded="true">文章内容</a>
                            </li>
                            <li class="">
                                <a data-toggle="tab" href="#tab-set" aria-expanded="false">文章设置</a>
                            </li>
                        </ul>
                        <div class="tab-content ">
                            <div id="tab-content" class="tab-pane active">
                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label required">归属栏目：</label>
                                        <div class="col-sm-8" style="padding-top: 7px;">
                                            <span class="label label-primary">@(ViewBag.ChannelName)</span>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label required">文章标题：</label>
                                        <div class="col-sm-7">
                                            <input type="text" name="title" id="title" value="" class="form-control" data-rule="required;">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">封面图片：</label>
                                        <div class="col-sm-8">
                                            <div class="cupload-upload-box" id="uploader">
                                                <span class="cupload-upload-btn">+</span>
                                            </div>
                                            <ul class="cupload-image-boxs" id="imgList">
                                            </ul>
                                            <input type="hidden" name="cover_image" id="cover_image" value="" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">内容摘要：</label>
                                        <div class="col-sm-8">
                                            <textarea cols="80" rows="4" id="summary" name="summary"></textarea>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        @*<label class="col-sm-2 control-label required">内容：</label>*@
                                        <div class="col-sm-11" style="margin-left: 50px;">
                                            <div>
                                                <button class="btn btn-primary " type="button" onclick="upVideo();"><i class="fa fa-video-camera"></i>&nbsp;插入视频</button>
                                                <button class="btn btn-primary " type="button" onclick="upFile();"><i class="fa fa-tags"></i>&nbsp;添加附件</button>
                                            </div>
                                            <textarea id="content" name="content" style="height:600px;"></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="tab-set" class="tab-pane">
                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">文章属性：</label>
                                        <div class="col-sm-6">
                                            <div class="checkbox checkbox-success checkbox-inline">
                                                <input type="checkbox" id="is_top" name="is_top" value="1">
                                                <label for="is_top">置顶</label>
                                            </div>
                                            <div class="checkbox checkbox-success checkbox-inline">
                                                <input type="checkbox" id="is_recommend" name="is_recommend" value="1">
                                                <label for="is_recommend">推荐</label>
                                            </div>
                                        </div>

                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">作者：</label>
                                        <div class="col-sm-6">
                                            <input type="text" name="author" id="author" value="" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">来源：</label>
                                        <div class="col-sm-6">
                                            <input type="text" name="source" id="source" value="" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">浏览量：</label>
                                        <div class="col-sm-6">
                                            <input type="number" name="hit_count" id="hit_count" value="1" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">审核状态：</label>
                                        <div class="col-sm-4">
                                            <div class="radio radio-success radio-inline">
                                                <input type="radio" id="content_status" value="2" name="content_status">
                                                <label for="status">草稿</label>
                                            </div>
                                            <div class="radio radio-success radio-inline">
                                                <input type="radio" id="content_status2" value="0" name="content_status">
                                                <label for="status2">待审核</label>
                                            </div>
                                            <div class="radio radio-success radio-inline">
                                                <input type="radio" id="content_status3" value="1" name="content_status" checked="">
                                                <label for="status3">审核通过</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">外部链接：</label>
                                        <div class="col-sm-6">
                                            <input type="text" name="content_href" id="content_href" value="" class="form-control">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">添加时间：</label>
                                        <div class="col-sm-4">
                                            <input type="text" name="publish_time" id="publish_time" value="@(DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"))" onclick="WdatePicker({isShowClear:false,dateFmt:'yyyy-MM-dd HH:mm:ss'})" class="form-control" style="width:200px;" readonly="readonly">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="footerbar">
                        <div class="col-sm-12 col-sm-offset-3">
                            <button class="btn btn-primary" type="submit">
                                <i class="fa fa-check"></i>
                                发布文章
                            </button>
                            <button class="btn btn-danger" type="button" onclick="cancel()">
                                <i class="fa fa-reply-all"></i>关闭
                            </button>
                        </div>
                    </div>
                </form>
            </div>
           </div>
        </div>
    </div>
@section scripts{
    <script src="~/ui/plugins/My97DatePicker/WdatePicker.js"></script>
    <script src="~/ui/plugins/ueditor/ueditor.config.js"></script>
    <script src="~/ui/plugins/ueditor/ueditor.all.js"></script>
    <script src="~/ui/plugins/verUpload/verUpload.js"></script>
    <script>
        let editor;
        $(function () {
            let id = jutils.getQueryParam('id');
            let channelid = jutils.getQueryParam('channelId');

            $('#channel_id').val(channelid);


            $('#contentForm').validator({
                stopOnError: false,
                timely: 2,
                theme: "yellow_right",
                valid: function (form) {
                    // 表单验证通过，提交表单
                    jutils.ajaxPost('/Cms/Content/Save', $(form).serialize(),
                        function (res) {
                            jutils.postMessage('cms_content_form', "save content");
                            cancel();
                        });
                }
            });
            //初始化文本编辑器
            editor = UE.getEditor('content');
            loadData();
            initUpload();
        });
        function loadData() {
            var id = jutils.getQueryParam("id");
            jutils.ajaxGet('/Cms/Content/getmodel', { id: id }, function (res) {
                if (id != '0') {
                    var model = res.data.model

                    $('#contentForm').initFormData(model);
                    if (model.cover_image) {
                        initImage(model.cover_image);
                    }
                    editor.ready(function () {
                        editor.setContent(model.content);
                    });
                }
            });

        }


        function initUpload() {
            new verUpload({
                files: "#uploader",
                name: "files",
                load_list: true,
                method: '/api/upload/Uploadimg',
                success: function (d) {
                    var res = JSON.parse(d);
                    if (res.status) {
                        initImage(res.data.url);

                    } else {
                        jutils.error("图片上传失败");
                    }
                },
                fail: function (d) {
                    jutils.error(d);
                },
                size: 1024*2,
                ext: ['jpg', 'jpeg', 'png', 'gif']
            });

        }

        function initImage(imgUrl) {

            $('#cover_image').val(imgUrl);
            var imgHtml = '<li class="cupload-image-box" style="position:relative;">';
            imgHtml += '<img class="cupload-image-preview" src = "' + imgUrl + '" />';
            imgHtml += '<div class="cupload-image-delete" onclick="deletImage(this)" data-url="' + imgUrl + '">x</div>';
            imgHtml += '</li>';
            $('#imgList').append(imgHtml);
            $('#uploader').hide();
            $('#imgList').show();

        }

        function deletImage(obj) {

            $imgli = $(obj).parent('li');
            jutils.confirm('确认删除图片吗?', function () {
                $('#cover_image').val('');
                $imgli.remove();
                $('#imgList').hide();
                $('#uploader').show();
                $('.uploadFilesBox').remove();
            })
        }

        function upVideo() {
            localStorage.removeItem("video");
            layer.open({
                title:'视频上传',
                type: 2,
                area: ['600px', '400px'],
                fixed: false, //不固定
                maxmin: true,
                content: '/views/upvideo.html',
                end: function (lindex) {
                    layer.close(lindex); //如果设定了yes回调，需进行手工关闭
                    //console.log('关闭');
                    var videoJson = localStorage.getItem("video");
                    if (videoJson) {
                        var video = JSON.parse(videoJson);
                        if (!jutils.empty(video.videoUrl)) {
                            var videoHtml = getVideoHtml(video);
                            // console.log(videoHtml);
                            editor.execCommand('insertHtml', videoHtml);
                        }

                        localStorage.removeItem("video");
                    }
                   // console.log('没有视频文件');
                }
            });
        }
        function upFile() {
            localStorage.removeItem("attachmentFile");
            layer.open({
                title: '附件上传',
                type: 2,
                area: ['600px', '400px'],
                fixed: false, //不固定
                maxmin: true,
                content: '/views/file.html',
                end: function (lindex) {
                    layer.close(lindex); //如果设定了yes回调，需进行手工关闭
               
                    var fileJson= localStorage.getItem("attachmentFile");
                    if (!jutils.empty(fileJson)) {
                        //var fileHtml = getVideoHtml(videoHref);
                        var attachmentFile = JSON.parse(fileJson);
                        var fileHtml = '<a href="' + attachmentFile.url + '">' + attachmentFile.name + '</a>';
                        editor.execCommand('insertHtml', fileHtml);
                    }
                    localStorage.removeItem("attachmentFile");
                }
            });
        }
        function cancel() {

            jutils.closeTab();
        }


        function getVideoHtml(video) {
            var id = jutils.localTimeString();
            //var videoHtml = '<div id="' + id + '" class="easycms-video" style="background:url(/static/images/video-clip.png) no-repeat 10px center;width:400px;height:400px;">';
            //videoHtml += '<embed src="/plugins/ckplayer/ckplayer.swf" flashvars="video=' + videoUrl + '"  quality="high" width="400" height="400" align="middle" allowScriptAccess="always" allowFullscreen="true" type="application/x-shockwave-flash"></embed>';
            //videoHtml += '</div>';

            var videoHtml = '<img id="' + id+'" class="easycms-player" src="/static/images/video-clip.png" player="' + video.player+'" playurl="' + video.videoUrl + '" style="width:400px; height: 400px;">';
            return videoHtml;
        }
    </script>
}





